<hr class="layui-bg-gray">
<hr class="layui-bg-gray">

<div style="width: 100%;">

    <table style="width: 100%;" id="sea-tab">
        <tr style="width: 100%;height: 40px">
            <td style="text-align: right">配置名称：</td>
            <td><input name="name" id="name" style="width: 150px;height: 19px"></td>
            <td style="text-align: right">备注：</td>
            <td><input name="remark" id="remark" style="width: 150px;height: 19px"></td>
            <td style="text-align: right">配置类型：</td>
            <td>
                <select name="conType" id="conType" style="width: 150px;height: 24px;border-color: #777777;border-radius: 2px">
                    <option value="-1" selected="selected" disabled style="color: #888888">--请选择--</option>
                    <option value="1">结构同步</option>
                    <option value="2">数据同步</option>
                </select>
            </td>
            <td style="text-align: right">是否启用：</td>
            <td>
                <select name="isEnable" id="isEnable" style="width: 150px;height: 24px;border-color: #777777;border-radius: 2px">
                    <option value="-1" selected="selected" disabled style="color: #888888">--请选择--</option>
                    <option value="1">启用</option>
                    <option value="0">停用</option>
                </select>
            </td>
            <td style="width: 80px; text-align:center"><button onclick="queryTabConfig()" style="width: 60px; cursor:pointer">查 询</button></td>
            <td style="width: 80px; text-align:center"><button onclick="clearTabInput()" style="width: 60px; cursor:pointer">重 置</button></td>
            <td style="text-align:center">|</td>
            <td style="width: 80px; text-align:center"><button onclick="fillTabConfigInfo()" style="width: 60px; cursor:pointer">新增</button></td>
            <td style="text-align:center">|</td>
            <td style="width: 80px; text-align:center"><button id="delTabConfig" style="width: 60px; cursor:pointer">批量删除</button></td>
        </tr>
    </table>

</div>

<hr class="layui-bg-gray">
<hr class="layui-bg-gray" id="tempConfigId">

<table class="layui-hide" id="pagingInfo" lay-filter="pagingInfo" style="width: 100%"></table>

<script type="text/html" id="tabConfigBar">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="detail">数据库配置</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script>
    $(function () {
        tabConfigInfo(null,null,null,null);
    })

    function queryTabConfig() {
        var name = $('#name').val();
        var remark = $('#remark').val();
        var conType = $('#conType').val();
        var isEnable = $('#isEnable').val();
        tabConfigInfo(name,remark,conType,isEnable);
    }

    function clearTabInput() {
        $('#sea-tab input').val('');
        $('#conType').val('-1');
        $('#isEnable').val('-1');
    }

    function fillTabConfigInfo() {
        layer.open({
            title:'添加配置',
            id: 'LAY_tabAdd',//设定一个id，防止重复弹出
            type: 1,
            area: ['350px', '400px'],
            shadeClose: true,
            closeBtn: 0,
            btn: ['添加','取消'],
            content: getHtml('/sys/tabConfig/edit.html'),
            yes: function(index){
                layer.close(index);
                // 执行确定逻辑
                addTabConfig();

            }
            ,btn2: function(index){
                layer.close(index);
            }
        });
    }

    function addTabConfig() {
        let name = $('#etName1').val();
        let remark = $('#etRemark1').val();
        let conType = $('input[name="conType"]:checked').val();
        let isEnable;
        if ($('#etEnable1').prop('checked')){
            isEnable = '1';
        }else {
            isEnable = '0';
        }
        let isPublic;
        if ($('#etPublic1').prop('checked')){
            isPublic = '1';
        }else {
            isPublic = '0';
        }

        let url = 'tableConfig/addRecord';
        let params = {'name':name,'remark':remark,'conType':conType,'isEnable':isEnable,'isPublic':isPublic};

        $.ajax({  "type":"post",
            "url":url,
            "data":params,
            "success":function(result){
                //alert(result.desc);
                layer.msg(result.desc);
                loadTabConfigPaging();

            }
        })
    }

    function updateTabConfig() {
        let id = $('#etId1').val();
        let name = $('#etName1').val();
        let remark = $('#etRemark1').val();
        let conType = $('input[name="conType"]:checked').val();
        let isEnable;
        if ($('#etEnable1').prop('checked')){
            isEnable = '1';
        }else {
            isEnable = '0';
        }
        let isPublic;
        if ($('#etPublic1').prop('checked')){
            isPublic = '1';
        }else {
            isPublic = '0';
        }

        let url = 'tableConfig/updateOneById';
        let params = {'id':id,'name':name,'remark':remark,'conType':conType,'isEnable':isEnable,'isPublic':isPublic};

        $.ajax({  "type":"post",
            "url":url,
            "data":params,
            "success":function(result){
                //alert(result.desc);
                layer.msg(result.desc);
                loadTabConfigPaging();
            }})
    }

    function deleteConfigByIds(ids) {
        layer.confirm('确定删除吗?', function(){
            let url = 'tableConfig/deleteByIds';
            $.ajax({  "type":"post",
                "url":url,
                "data":{'ids':ids},
                "success":function(result){
                    //alert(result.desc);
                    layer.msg(result.desc);
                    loadTabConfigPaging();
                }
            })
        });


    }


    function editDbInfoList() {
        layer.open({
            title:'配置数据库信息',
            id: 'LAY_tabDbInfo',//设定一个id，防止重复弹出
            type: 1,
            area: ['1000px', '600px'],
            shadeClose: true,
            closeBtn: 0,
            btn: ['关闭'],
            content: getHtml('/sys/dbInfo/page.html'),
            yes: function(index){
                layer.close(index);
            }
        });
    }

</script>

<script>
    layui.use('table', function(){
        var table = layui.table;
        //监听表格复选框选择
        table.on('checkbox(pagingInfo)', function(obj){
            console.log(obj)
        });
        //监听工具条
        table.on('tool(pagingInfo)', function(obj){
            var data = obj.data;
            if(obj.event === 'detail'){
                //查看操作
                $('#tempConfigId').attr('tempConfigId',data.id);
                editDbInfoList();
            } else if(obj.event === 'del'){
                deleteConfigByIds(data.id);

            } else if(obj.event === 'edit'){
                // 编辑操作
                $('#page-com').data('tabCon',data);

                layer.open({
                    title:'修改配置',
                    id: 'LAY_tabEdit',//设定一个id，防止重复弹出
                    type: 1,
                    area: ['350px', '400px'],
                    shadeClose: true,
                    closeBtn: 0,
                    btn: ['修改','取消'],
                    content: getHtml('/sys/tabConfig/edit.html'),
                    yes: function(index){
                        layer.close(index);
                        // 执行确定逻辑
                        updateTabConfig();
                        loadTabConfigPaging();

                    }
                    ,btn2: function(index){
                        layer.close(index);
                    }
                });
            }
        });

        //批量删除
        $('#delTabConfig').click(function () {
            var checkStatus = table.checkStatus('tabDataList');
            var ids = [];
            $(checkStatus.data).each(function (i, o) {//o即为表格中一行的数据
                ids.push(o.id);
            });
            if (ids.length < 1) {
                layer.msg('无选中项');
                return false;
            }
            ids = ids.join(",");

            // 指删除操作
            deleteConfigByIds(ids);
        });

        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>